<%-- 
    Document   : accountlist
    Created on : Dec 5, 2012, 12:30:00 AM
    Author     : Quang Nhat
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Account List</title>
        <script src="js/xml.js" type="text/javascript"></script>
        <script src="js/table.js" type="text/javascript"></script>
        <script type="text/javascript">
            var dom;
            function init() {
                dom = getXMLDOM();
                dom.load("Accountant/XML?action=listAccount");
                load();
                
            }
            function load() {
                var root = dom.documentElement;
                var txtAccNumber = document.getElementById("txtSearchAccNumber").value;
                var txtAccName = document.getElementById("txtSearchAccName").value;
                clearTable("accountlist");
                for(var i = 0; i < root.childNodes.length; i++) {
                    var node = root.childNodes[i];
                    if (node.getAttribute("AccountNumber").toLowerCase().indexOf((txtAccNumber)) >= 0 && node.firstChild.firstChild.nodeValue.toLowerCase().indexOf((txtAccName)) >= 0) {
                        addAccountToTable(node);
                    }
                }
            }
            function searchAccount(number) {
                var root = dom.documentElement;
                for(var i = 0; i < root.childNodes.length; i++) {
                    if (root.childNodes[i].getAttribute('AccountNumber') == number) {
                        return root.childNodes[i];
                    }
                }
                return null;
            }
            function findPos(number) {
                var root = dom.documentElement;
                for(var i = 0; i < root.childNodes.length; i++) {
                    if (Number(root.childNodes[i].getAttribute('AccountNumber')) > number) {
                        return root.childNodes[i];
                    }
                }
                return null;
            }

            function addAccountToTable(node) {
                var cells = [];
                var number = node.getAttribute('AccountNumber');
                cells[0] = "<input id='txtAccNumber"+number+"' type='hidden' name='txtAccountNumber' value='"+number+"' />" + number;
                cells[1] = "<input id='txtAccName"+number+"' type='text' name='txtAccountName' value='"+node.firstChild.firstChild.nodeValue+"' />";
                var active = node.getAttribute('Active') == "true";

                if (active) {
                    cells[2] = "<input id='chkActive"+number+"' type='checkbox' name='chkActive' checked='checked'/>";
                } else {
                    cells[2] = "<input id='chkActive"+number+"' type='checkbox' name='chkActive' />";
                }
                
                cells[3] = "<input type='button' value='Update' onclick='update(\""+number+"\")'/>";
                addTableRow("accountlist", cells);
            }
            
            function update(id) {
                var node = searchAccount(id);
                var accNumber = Number(document.getElementById("txtAccNumber" + id).value);
                var accName = document.getElementById("txtAccName"+id).value;
                var active = document.getElementById("chkActive" + id).checked;
                
                if (isNaN(accNumber) || accNumber < 100) {
                    alert("Account Number must be a valid number equal or greater than 100");
                    load();
                    return;
                }
                
                if (accName.trim() == "") {
                    alert("Account Name cannot be null or empty.");
                    load();
                    return;
                }
                
                if (accNumber != id && searchAccount(accNumber)!=null) {
                    alert("Account Number is already exists.");
                    load();
                    return;
                }

                var content = "action=updateAccount&accNumber=" + accNumber + "&accName=" +accName;
                if (active == true) {
                    content += "&active=" + active;
                }
                var result = sendXmlHttpRequest("Accountant/XML", content);
                
                if (result == "") {
                    node.setAttribute("AccountNumber", String(accNumber));
                    node.setAttribute("Active", String(active));
                    node.firstChild.firstChild.nodeValue=accName;
                } else {
                    alert(result);
                }
                load();
            }
            function addAccount(accNumber, accName, active) {
                //validate
                var num = Number(accNumber);
                
                if (isNaN(num) || num < 100) {
                    alert("Account Number must be a valid number equal or greater than 100");
                    return;
                }
                
                if (accName.trim() == "") {
                    alert("Account Name cannot be null or empty.");
                    return;
                }
                
                if (searchAccount(num)!=null) {
                    alert("Account Number is already exists.");
                    return;
                }
                
                var content = "action=addAccount&accNumber=" + accNumber + "&accName=" +accName;
                if (active == "true") {
                    content += "&active=" + active;
                }
                var result = sendXmlHttpRequest("Accountant/XML", content);
                
                if(result == "") {
                    var root = dom.documentElement;
                    var acc = dom.createElement("Account");
                    acc.setAttribute("AccountNumber", accNumber);
                    acc.setAttribute("Active", active);
                    var name = dom.createElement("AccountName");
                    name.appendChild(dom.createTextNode(accName));
                    acc.appendChild(name);
                    pos = findPos(num);
                    if (pos == null) {
                        root.appendChild(acc);
                    } else {
                        root.insertBefore(acc, pos);
                    }
                } else {
                    alert(result);
                }
                load();
            }
            function getValueandAdd() {
                var number = document.getElementById("txtAccNumber").value;
                var name = document.getElementById("txtAccName").value;
                addAccount(number, name, "true");
            }
            function resetSearchForm() {
                document.getElementById("txtSearchAccNumber").value = "";
                document.getElementById("txtSearchAccName").value = "";
                load();
            }
        </script>
    </head>
    <body onload="init();">
        <%@include file="/WEB-INF/jspf/Header.jspf" %>
        <h1>Account List</h1>
        <div class="form" style="overflow: hidden;width:300px">
            <div><label >Account Number: <input id="txtAccNumber" type="text" name="txtAccNumber" value="" /></label></div>
            <div><label >Account Name: <input id="txtAccName" type="text" name="txtAccName" value="" /></label></div>
            <div class="form-control"><input type="button" value="Add" onclick="getValueandAdd()"/></div>
        </div>
        <div class="form" style="overflow: hidden;width:300px">
            <div><label >Account Number: <input id="txtSearchAccNumber" type="text" name="txtAccNumber" value="" /></label></div>
            <div><label >Account Name: <input id="txtSearchAccName" type="text" name="txtAccName" value="" /></label></div>
            <div class="form-control">
                <input type="reset" value="Reset" onclick="resetSearchForm()"/>
                <input type="button" value="Search" onclick="load()"/>
            </div>
        </div>
        <div style="height: 30px"></div>
        <table border="1" id="accountlist">
            <thead>
                <tr>
                    <th>Account Number</th>
                    <th>Account Name</th>
                    <th>Active</th>
                    <th>Update</th>
                </tr>
            </thead>
            <tbody>
            </tbody>
        </table>
    </body>
</html>
